.dependency-view {
    overflow-y: auto;
    background-color: white;
    .link {
        fill: none;
        stroke: #666;
        stroke-width: 1.5px;
        opacity: 0.5;
        transition-property: opacity;
        transition-duration: .2s;
        &.incomming {
            stroke: green;
            opacity: 0.9;
        }
        &.outgoing {
            stroke: red;
            opacity: 0.9;
        }
        &.dimmed{
            opacity: 0.05;
        }
        &.filtered-out{
            opacity: 0;
        }
    }
    #licensing {
        fill: green;
    }
    circle {
        fill: #ccc;
        stroke: #333;
        stroke-width: 1.5px;
        transition-property: opacity,fill;
        transition-duration: .2s;
        opacity: 1;
        &.inonly {
            fill: green;
        }
        &.outonly {
            fill: blue;
        }
        &.circular {
            fill: red;
        }
        &.fixed {
            // Some other day: fill: yellow;
        }
        &.hovering {
            opacity: 1;
            fill: #b94431;
        }
        &.not-hovering {
            opacity: 0.05;
        }
        &.filtered-out {
            opacity: 0;
        }
    }
    text {
        font: 10px sans-serif;
        pointer-events: none;
        text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff;
        &.dimmed {
            opacity: 0.05;
        }
        &.filtered-out {
            opacity: 0;
        }
    }
    g.dimmed {
        stroke-opacity: 0.05;
    }
    .control-zoom {
        position: absolute;
        top: 10px;
        left: 10px;
        background: rgba(0, 0, 0, 0.25);
        padding: 5px;
        border-radius: 7px;
        z-index: 100;
        display: inline-block;
    }
    .control-zoom a {
        background: rgba(255, 255, 255, 0.75);
        background-position: 50% 50%;
        background-repeat: no-repeat;
        display: block;
        width: 19px;
        height: 19px;
        border-radius: 4px;
    }
    .control-zoom a:last-child {
        margin: 0;
    }
    .control-zoom a:hover {
        background-color: white;
    }
    .control-zoom > .control-zoom-in {
        background-image: url();
        margin-bottom: 5px;
    }
    .control-zoom > .control-zoom-out {
        background-image: url();
        margin-bottom: 5px;
    }
    .control-zoom > .control-fit {
        text-decoration: none;
        &:before {
            // Font awesome
            content: "\f0b2";
            font: normal normal normal 10px/1 FontAwesome;
            font-size: inherit;

            // customize
            color: rgba(0,0,0,0.75);
            margin-left: 3px;
        }
    }
}
